<template>
  <div class="container">
    <div class="navbar">
      <el-tooltip v-if="!mobile" class="item" effect="light" content="回到首页" placement="bottom">
        <div id="a" @click="logoClick"></div>
      </el-tooltip>
      <div id="a" v-else @click="logoClick"></div>
      <div id="search">
        欢迎你 <span>{{form.userName}}</span>
      </div>
      <div class="subtitle">{{subtitle}}</div>
      <el-button type="text" v-preventClick v-if="$store.state.admin" @click="remove">清理内存</el-button type="text">
      <!-- <div v-else></div> -->
       <el-tooltip class="item" effect="light" content="暂时没有通知哦" placement="bottom">
       <svg
        t="1595859437852"
        class="icon aaa"
        viewBox="0 0 1024 1024"
        version="1.1"
        xmlns="http://www.w3.org/2000/svg"
        p-id="1814"
      >
        <path
          d="M512.014953 1024a99.406443 99.406443 0 0 0 100.542858-100.542858h-201.115622a99.107386 99.107386 0 0 0 100.572764 100.542858zM841.844572 696.802079v-261.19611a335.272451 335.272451 0 0 0-257.009316-323.698957v-32.896235a73.298794 73.298794 0 1 0-146.208814-1.016793v34.959726a332.879998 332.879998 0 0 0-256.50092 322.682165V696.802079l-99.526065 102.606349v51.288222h858.741275v-51.377939L841.844572 696.802079z"
          p-id="1815"
        />
      </svg>
    </el-tooltip>
     
      <svg
        v-if="happy"
        @click="toggle"
        t="1596888906235"
        class="icon aaa"
        viewBox="0 0 1024 1024"
        version="1.1"
        xmlns="http://www.w3.org/2000/svg"
        p-id="1799"
      >
        <path
          d="M479.30332 441.537182c-0.025583-0.093121-0.054235-0.188288-0.085958-0.282433l0.014326-0.019443-0.022513-0.00307c-0.034792-0.101307-0.073678-0.203638-0.115634-0.304945-0.11768-0.285502-0.313132-0.448208-0.580215-0.484024-0.032746-0.004093-0.066515-0.007163-0.098237-0.007163-0.228197 0-0.427742 0.109494-0.592494 0.324388l-0.201591 0.26299-0.010233-0.001023 0.004093 0.010233-0.808412 1.057075c-0.011256 0.01228-0.022513 0.025583-0.033769 0.039909-0.013303 0.016373-0.027629 0.033769-0.034792 0.040932-0.023536 0.026606-0.048095 0.053212-0.072655 0.077771-0.019443 0.020466-0.047072 0.041956-0.075725 0.065492-0.039909 0.032746-0.084934 0.068562-0.125867 0.112564-0.029676 0.020466-0.061398 0.041956-0.093121 0.061398-0.068562 0.042979-0.140193 0.081864-0.213871 0.11768-0.010233 0.005117-0.021489 0.010233-0.031722 0.014326l-0.001023 0.001023c-0.028653 0.011256-0.056282 0.021489-0.082888 0.030699-0.079818 0.027629-0.162706 0.050142-0.245593 0.068562-0.013303 0.00307-0.025583 0.005117-0.038886 0.008186-0.020466 0-0.040932 0.00307-0.094144 0.014326-0.076748 0.00614-0.14224 0.010233-0.206708 0.010233l-0.007163 0c-0.069585 0-0.140193-0.00614-0.210801-0.011256l-0.00614-0.001023c-0.00614-0.001023-0.011256-0.001023-0.016373-0.002047-0.041956-0.007163-0.084934-0.016373-0.125867-0.025583-0.075725-0.017396-0.150426-0.039909-0.222057-0.065492-0.008186-0.00307-0.026606-0.011256-0.056282-0.025583-0.014326-0.007163-0.031722-0.01535-0.055259-0.020466-0.007163-0.00307-0.014326-0.007163-0.021489-0.010233-0.071631-0.035816-0.141216-0.075725-0.206708-0.118704-0.01842-0.01228-0.036839-0.024559-0.054235-0.036839-0.022513-0.022513-0.047072-0.038886-0.066515-0.051165-0.056282-0.047072-0.109494-0.098237-0.159636-0.150426-0.028653-0.029676-0.055259-0.059352-0.079818-0.088004-0.00614-0.007163-0.01228-0.014326-0.01842-0.021489l-0.010233-0.01228c-0.081864-0.11461-0.153496-0.23843-0.220011-0.3776l-0.00307-0.007163c-0.00307-0.008186-0.00614-0.01535-0.008186-0.021489-0.01228-0.033769-0.023536-0.065492-0.032746-0.097214-0.025583-0.080841-0.047072-0.163729-0.062422-0.246617-0.002047-0.008186-0.005117-0.028653-0.008186-0.048095l-0.004093-0.029676c-0.002047-0.017396-0.004093-0.034792-0.004093-0.040932-0.00614-0.080841-0.008186-0.161682-0.005117-0.2415 0.001023-0.037862 0.004093-0.075725 0.007163-0.11461 0-0.002047 0-0.004093 0.001023-0.007163 0.008186-0.037862 0.01535-0.075725 0.021489-0.11154 0.008186-0.045025 0.01535-0.088004 0.025583-0.125867 0.01842-0.067538 0.040932-0.13303 0.069585-0.211824 0.008186-0.01842 0.013303-0.029676 0.017396-0.037862 0.014326-0.029676 0.029676-0.060375 0.045025-0.089028 0.054235-0.100284 0.11768-0.199545 0.195451-0.301875 0.065492-0.085958 0.12996-0.170892 0.195451-0.25685l0.574075-0.751107 0.067538 0.008186-0.031722-0.055259 0.246617-0.322341c0.164752-0.215918 0.132006-0.532119 0.014326-0.733711-0.155543-0.26606-0.409322-0.325411-0.585331-0.347924-0.210801-0.026606-0.425695-0.039909-0.64059-0.039909-1.606591 0-3.168156 0.724501-4.177136 1.937119-0.651846 0.782829-1.073448 1.691525-1.219781 2.625804-0.105401 0.672312-0.094144 1.342578 0.029676 1.974981l-5.073552 6.636141c-0.26913 0.352017-0.538259 0.704035-0.807389 1.056052-0.413416 0.541329-0.662079 1.204431-0.718361 1.918699-0.075725 0.958838 0.260943 1.936095 0.926092 2.680039 0.64366 0.721431 1.584078 1.152243 2.580778 1.183965 0.035816 0.001023 0.072655 0.002047 0.109494 0.002047 0.929162 0 1.847068-0.370437 2.518357-1.017166 0.185218-0.179079 0.338714-0.38067 0.487094-0.577145 0.023536-0.031722 0.048095-0.063445 0.071631-0.095167l4.592598-6.007831c0.353041-0.462534 0.706081-0.924045 1.059122-1.385557l0.00614 0-0.00307-0.005117c0.004093-0.005117 0.007163-0.00921 0.011256-0.014326 1.321088-0.098237 2.577708-0.666172 3.497661-1.591241 0.671289-0.675382 1.156336-1.526773 1.403976-2.460028C479.55403 443.434391 479.553007 442.455087 479.30332 441.537182zM465.382263 456.302467l-0.024559-0.004093 0.040932-0.170892c0.049119 0.039909 0.081864 0.106424 0.073678 0.181125C465.441615 456.307583 465.411939 456.305537 465.382263 456.302467zM469.89709 446.565708c0.008186 0.010233 0.017396 0.019443 0.025583 0.029676 0.007163 0.008186 0.01535 0.016373 0.022513 0.024559 0.137123 0.152473 0.281409 0.297782 0.433882 0.434905 0.675382 0.603751 1.487887 1.030469 2.349511 1.235131 0.002047 0 0.004093 0.001023 0.00614 0.001023l-5.301749 6.934946c-0.038886 0.033769-0.067538 0.073678-0.091074 0.105401-0.00921 0.013303-0.020466 0.027629-0.026606 0.034792-0.062422 0.069585-0.12996 0.137123-0.200568 0.200568-0.024559 0.022513-0.051165 0.045025-0.076748 0.066515-0.023536 0.014326-0.053212 0.033769-0.079818 0.060375-0.073678 0.051165-0.148379 0.098237-0.225127 0.140193-0.038886 0.021489-0.077771 0.041956-0.115634 0.061398-0.010233 0.005117-0.048095 0.021489-0.067538 0.029676-0.013303 0.005117-0.024559 0.011256-0.033769 0.014326-0.005117 0.002047-0.00921 0.004093-0.014326 0.00614-0.167822 0.062422-0.312108 0.104377-0.452301 0.132006-0.033769 0.007163-0.068562 0.01228-0.102331 0.01842-0.007163 0.001023-0.014326 0.001023-0.020466 0.002047-0.008186 0.001023-0.016373 0.002047-0.024559 0.002047-0.082888 0.007163-0.166799 0.011256-0.249687 0.011256-0.011256 0-0.023536 0-0.034792 0-0.070608-0.001023-0.147356-0.005117-0.2415-0.014326-0.056282-0.01228-0.079818-0.01535-0.101307-0.01535-0.039909-0.007163-0.078795-0.016373-0.118704-0.025583-0.084934-0.020466-0.169869-0.044002-0.251733-0.072655-0.031722-0.011256-0.064468-0.023536-0.099261-0.036839l-0.033769-0.014326c-0.014326-0.00614-0.028653-0.013303-0.041956-0.019443-0.105401-0.050142-0.202615-0.115634-0.305969-0.184195-0.033769-0.022513-0.068562-0.045025-0.104377-0.068562-0.008186-0.007163-0.01842-0.014326-0.027629-0.021489-0.013303-0.00921-0.042979-0.029676-0.051165-0.036839-0.037862-0.032746-0.075725-0.066515-0.110517-0.101307-0.060375-0.058328-0.118704-0.12075-0.173962-0.184195-0.01842-0.031722-0.042979-0.059352-0.065492-0.082888-0.021489-0.029676-0.042979-0.061398-0.064468-0.093121-0.053212-0.080841-0.101307-0.164752-0.144286-0.249687-0.014326-0.028653-0.028653-0.058328-0.041956-0.088004l-0.013303-0.028653c-0.00307-0.008186-0.007163-0.016373-0.010233-0.025583-0.033769-0.088004-0.063445-0.179079-0.088004-0.271176-0.020466-0.075725-0.037862-0.154519-0.052189-0.233314-0.002047-0.020466-0.005117-0.041956-0.00921-0.064468l-0.002047-0.026606c-0.00307-0.039909-0.007163-0.078795-0.00921-0.115634-0.004093-0.090051-0.004093-0.181125 0-0.272199 0.002047-0.042979 0.005117-0.085958 0.00921-0.12996 0.001023-0.00921 0.002047-0.01842 0.00307-0.027629l0.00307-0.01842c0.029676-0.174985 0.075725-0.346901 0.138146-0.51063 0.01842-0.032746 0.036839-0.066515 0.046049-0.103354 0.010233-0.021489 0.021489-0.041956 0.031722-0.063445 0.045025-0.086981 0.097214-0.172939 0.152473-0.255827 0.190335-0.282433 0.408299-0.559748 0.620124-0.826831 0.096191-0.122797 0.196475-0.248663 0.292666-0.375553l4.468778-5.845125C469.408973 445.951725 469.63717 446.27202 469.89709 446.565708zM477.782687 444.555935l-0.01228-0.004093c0 0 0-0.001023 0.001023-0.001023L477.782687 444.555935zM477.774501 444.546725c0.001023-0.001023 0.002047-0.00307 0.00307-0.004093l0 0 0.01535 0.01228L477.774501 444.546725zM477.82669 444.580494l0.083911 0.065492-0.113587 0.077771c-0.037862-0.055259-0.040932-0.11768-0.030699-0.162706L477.82669 444.580494zM477.780641 444.51398c-0.00307 0.007163-0.005117 0.014326-0.008186 0.022513-0.002047 0.005117-0.005117 0.011256-0.008186 0.01842-0.020466 0.045025-0.039909 0.089028-0.061398 0.13303-0.045025 0.093121-0.093121 0.185218-0.143263 0.273223-0.086981 0.153496-0.190335 0.311085-0.324388 0.494257l-0.01842 0.022513c-0.00921 0.011256-0.017396 0.021489-0.026606 0.032746-0.026606 0.032746-0.055259 0.065492-0.082888 0.098237-0.070608 0.080841-0.144286 0.159636-0.217964 0.234337-0.062422 0.062422-0.127913 0.124843-0.195451 0.184195-0.033769 0.029676-0.069585 0.060375-0.106424 0.092098-0.016373 0.013303-0.031722 0.027629-0.046049 0.041956-0.00307 0.00307-0.00614 0.00614-0.010233 0.00921-0.01228 0.00614-0.024559 0.014326-0.036839 0.022513-0.011256 0.008186-0.023536 0.016373-0.034792 0.025583-0.010233 0.007163-0.020466 0.01535-0.030699 0.022513-0.037862 0.026606-0.076748 0.054235-0.11461 0.079818-0.080841 0.054235-0.164752 0.106424-0.248663 0.155543-0.146333 0.084934-0.302899 0.159636-0.446162 0.226151-0.007163 0.00307-0.014326 0.00614-0.022513 0.00921-0.01842 0.008186-0.045025 0.020466-0.058328 0.025583-0.045025 0.017396-0.092098 0.034792-0.143263 0.052189-0.085958 0.029676-0.172939 0.057305-0.260943 0.082888-0.172939 0.049119-0.349971 0.088004-0.528026 0.116657-0.013303 0.001023-0.029676 0.00307-0.069585 0.010233-0.038886 0.004093-0.078795 0.00921-0.11768 0.01228-0.095167 0.008186-0.192382 0.014326-0.287549 0.016373-0.041956 0.001023-0.083911 0.001023-0.12689 0.001023-0.014326 0-0.027629 0-0.041956 0-0.022513 0-0.046049-0.001023-0.068562-0.001023-0.030699-0.001023-0.061398-0.002047-0.092098-0.00307-0.024559-0.001023-0.048095-0.002047-0.072655-0.004093-0.01228-0.001023-0.023536-0.001023-0.035816-0.002047-0.013303-0.001023-0.027629-0.002047-0.040932-0.00307-0.01842-0.002047-0.037862-0.004093-0.058328-0.007163-0.045025-0.00614-0.096191-0.013303-0.149403-0.014326l0 0c-0.017396-0.00307-0.034792-0.005117-0.052189-0.008186-0.001023 0-0.002047 0-0.00307 0-0.062422-0.010233-0.124843-0.022513-0.186242-0.035816-0.035816-0.007163-0.070608-0.01535-0.105401-0.023536-0.00614-0.001023-0.01228-0.00307-0.019443-0.004093-0.032746-0.008186-0.065492-0.016373-0.097214-0.024559-0.01228-0.00307-0.023536-0.00614-0.035816-0.00921-0.039909-0.011256-0.078795-0.022513-0.118704-0.033769-0.004093-0.001023-0.008186-0.002047-0.01228-0.00307-0.044002-0.013303-0.088004-0.027629-0.130983-0.041956-0.010233-0.004093-0.021489-0.008186-0.031722-0.011256-0.028653-0.010233-0.057305-0.019443-0.084934-0.029676-0.030699-0.011256-0.060375-0.022513-0.091074-0.034792-0.008186-0.00307-0.016373-0.00614-0.024559-0.010233-0.023536-0.011256-0.047072-0.021489-0.068562-0.030699-0.01228-0.005117-0.024559-0.010233-0.036839-0.016373-0.011256-0.005117-0.023536-0.010233-0.034792-0.016373-0.029676-0.014326-0.059352-0.028653-0.089028-0.042979-0.00307-0.002047-0.007163-0.00307-0.010233-0.005117-0.021489-0.011256-0.042979-0.022513-0.064468-0.033769-0.020466-0.010233-0.040932-0.021489-0.060375-0.031722-0.014326-0.008186-0.027629-0.01535-0.041956-0.023536-0.024559-0.013303-0.049119-0.027629-0.073678-0.041956-0.011256-0.00614-0.022513-0.013303-0.033769-0.019443-0.024559-0.014326-0.049119-0.029676-0.073678-0.045025-0.014326-0.00921-0.028653-0.017396-0.041956-0.026606-0.022513-0.014326-0.045025-0.028653-0.066515-0.042979-0.026606-0.017396-0.054235-0.035816-0.079818-0.053212-0.037862-0.026606-0.076748-0.054235-0.118704-0.083911-0.00614-0.004093-0.01228-0.00921-0.019443-0.013303-0.00307-0.002047-0.007163-0.005117-0.010233-0.007163-0.004093-0.00307-0.008186-0.00614-0.011256-0.00921-0.008186-0.007163-0.016373-0.013303-0.024559-0.019443-0.002047-0.001023-0.004093-0.00307-0.005117-0.004093-0.034792-0.027629-0.068562-0.056282-0.101307-0.084934-0.004093-0.004093-0.00921-0.008186-0.013303-0.01228-0.020466-0.017396-0.039909-0.035816-0.060375-0.053212-0.019443-0.017396-0.038886-0.034792-0.057305-0.052189-0.010233-0.010233-0.021489-0.020466-0.031722-0.029676-0.022513-0.021489-0.046049-0.042979-0.067538-0.065492-0.008186-0.008186-0.017396-0.017396-0.025583-0.025583-0.021489-0.021489-0.042979-0.044002-0.064468-0.065492-0.010233-0.010233-0.019443-0.020466-0.029676-0.031722-0.01228-0.013303-0.024559-0.026606-0.036839-0.038886-0.065492-0.071631-0.12996-0.146333-0.196475-0.228197-0.008186-0.01228-0.016373-0.023536-0.023536-0.032746-0.002047-0.00307-0.004093-0.00614-0.00614-0.00921-0.002047-0.00307-0.00307-0.005117-0.004093-0.007163l0 0c-0.00614-0.008186-0.01228-0.01535-0.01842-0.022513-0.005117-0.007163-0.010233-0.014326-0.01535-0.020466-0.008186-0.011256-0.016373-0.022513-0.023536-0.033769-0.014326-0.020466-0.029676-0.041956-0.044002-0.063445-0.011256-0.016373-0.022513-0.033769-0.033769-0.050142-0.014326-0.021489-0.027629-0.042979-0.040932-0.064468-0.010233-0.01535-0.019443-0.030699-0.029676-0.047072-0.013303-0.021489-0.026606-0.044002-0.039909-0.066515-0.01228-0.019443-0.023536-0.039909-0.034792-0.059352-0.011256-0.019443-0.022513-0.039909-0.033769-0.060375-0.01228-0.021489-0.023536-0.042979-0.034792-0.064468-0.016373-0.031722-0.033769-0.063445-0.050142-0.095167-0.002047-0.004093-0.004093-0.007163-0.005117-0.011256-0.021489-0.042979-0.041956-0.085958-0.062422-0.12996-0.004093-0.010233-0.00921-0.020466-0.014326-0.030699-0.01228-0.048095-0.038886-0.110517-0.078795-0.206708-0.00614-0.013303-0.010233-0.024559-0.014326-0.033769-0.002047-0.00614-0.004093-0.011256-0.00614-0.017396l0.029676-0.037862-0.044002-0.00614c-0.00921-0.028653-0.01842-0.057305-0.027629-0.085958-0.005117-0.01535-0.010233-0.030699-0.014326-0.046049-0.028653-0.093121-0.054235-0.188288-0.075725-0.283456-0.020466-0.088004-0.038886-0.176009-0.054235-0.264013-0.004093-0.023536-0.008186-0.048095-0.01228-0.072655 0-0.004093 0-0.011256 0-0.017396l0.00307-0.086981-0.017396-0.017396c-0.001023-0.00614-0.001023-0.01228-0.002047-0.017396-0.01842-0.188288-0.024559-0.379647-0.019443-0.569982 0.00307-0.095167 0.008186-0.191358 0.017396-0.285502 0.00307-0.035816 0.007163-0.071631 0.011256-0.106424l0.005117-0.034792c0.00307-0.01842 0.00614-0.037862 0.00921-0.056282 0.032746-0.194428 0.078795-0.388856 0.1361-0.577145 0.028653-0.093121 0.060375-0.186242 0.094144-0.275269 0.007163-0.01842 0.01228-0.036839 0.017396-0.052189 0.001023-0.005117 0.00307-0.00921 0.004093-0.013303 0.007163-0.01228 0.014326-0.025583 0.020466-0.039909 0.011256-0.024559 0.022513-0.050142 0.033769-0.074701 0.088004-0.189312 0.189312-0.37453 0.302899-0.551562 0.050142-0.078795 0.105401-0.158612 0.162706-0.236384 0.00614-0.008186 0.01228-0.017396 0.01842-0.026606 0.00307-0.004093 0.007163-0.00921 0.01228-0.014326 0.032746-0.040932 0.067538-0.082888 0.102331-0.12382 0.125867-0.146333 0.260943-0.286526 0.403183-0.415462 0.064468-0.058328 0.130983-0.115634 0.200568-0.170892 0.005117-0.004093 0.00921-0.008186 0.014326-0.011256l0.027629-0.021489c0.040932-0.030699 0.082888-0.060375 0.12382-0.089028 0.148379-0.102331 0.304945-0.197498 0.465604-0.281409 0.078795-0.041956 0.160659-0.081864 0.243547-0.118704 0.00921-0.004093 0.01842-0.008186 0.028653-0.01228l0.022513-0.010233c0.046049-0.01842 0.089028-0.035816 0.13303-0.051165 0.166799-0.061398 0.339738-0.11461 0.5137-0.155543 0.028653-0.007163 0.057305-0.013303 0.084934-0.019443-0.060375 0.078795-0.12075 0.157589-0.180102 0.236384-0.217964 0.286526-0.387833 0.626263-0.490164 0.984421-0.24764 0.862647-0.093121 1.848091 0.405229 2.571568 0.541329 0.785899 1.39886 1.280156 2.355651 1.356904 0.071631 0.005117 0.144286 0.008186 0.215918 0.008186 0.419556 0 0.849344-0.094144 1.278109-0.280386 0.450255-0.195451 0.857531-0.525979 1.210571-0.981351 0.002047-0.00307 0.004093-0.005117 0.00614-0.008186l0.112564-0.147356c0.00307 0.060375 0.005117 0.12075 0.005117 0.181125 0.002047 0.183172-0.007163 0.367367-0.026606 0.548492-0.001023 0.007163-0.00307 0.014326-0.004093 0.022513-0.001023 0.008186-0.002047 0.020466-0.004093 0.038886l-0.005117 0.033769c-0.005117 0.031722-0.010233 0.062422-0.01535 0.093121-0.01842 0.098237-0.039909 0.196475-0.063445 0.291642C477.913671 444.145589 477.852272 444.332854 477.780641 444.51398zM476.511741 446.193225c0.005117-0.004093 0.00921-0.00614 0.013303-0.008186l0.013303 0.038886L476.511741 446.193225zM477.235219 445.462584C477.235219 445.462584 477.236242 445.462584 477.235219 445.462584l0.029676 0.021489L477.235219 445.462584zM474.426243 447.14183c0.013303-0.051165 0.045025-0.093121 0.084934-0.118704l0.030699 0.178055-0.031722 0.00307C474.483548 447.181739 474.454896 447.160249 474.426243 447.14183zM470.189755 441.391872l0.055259 0.020466c-0.002047 0.007163-0.005117 0.013303-0.007163 0.019443L470.189755 441.391872zM470.674802 440.359356l0.12382-0.062422c0.034792 0.068562 0.023536 0.137123 0 0.184195L470.674802 440.359356zM478.17666 443.585841l-0.071631 0.066515c-0.024559-0.025583-0.037862-0.053212-0.046049-0.077771L478.17666 443.585841zM466.578508 455.927937c0.002047 0 0.004093 0 0.00614 0l0 0.01535L466.578508 455.927937zM467.099371 455.662901l-0.008186 0.010233-0.022513-0.037862c0.00921-0.001023 0.019443-0.002047 0.030699-0.002047L467.099371 455.662901zM464.195228 455.700763l0-0.080841c0.017396 0 0.032746 0.002047 0.046049 0.005117L464.195228 455.700763zM463.856513 455.227995l-0.080841 0.079818 0-0.097214c0 0 0 0 0 0C463.807395 455.211623 463.835024 455.218786 463.856513 455.227995zM463.269136 454.176037l-0.001023-0.113587c0 0 0.001023 0 0.001023 0 0.072655 0 0.12996 0.035816 0.164752 0.082888L463.269136 454.176037zM463.453331 453.02584l0.024559 0.01228 0.100284 0.057305c-0.029676 0.022513-0.071631 0.041956-0.124843 0.041956L463.453331 453.02584zM478.213499 442.566628l0.027629-0.035816 0 0.037862C478.231919 442.568674 478.222709 442.567651 478.213499 442.566628zM473.598388 440.993806l0-0.12382 0.164752 0.040932C473.727325 440.95799 473.671043 440.993806 473.598388 440.993806zM476.132094 442.62598l0.019443 0.050142-0.021489-0.050142C476.130048 442.62598 476.131071 442.62598 476.132094 442.62598zM475.632721 442.774359l0.039909 0.169869-0.057305 0.007163c-0.019443 0.001023-0.037862 0.002047-0.057305 0.00307C475.54881 442.87669 475.586672 442.812221 475.632721 442.774359zM475.29196 442.777429c0.051165 0.037862 0.086981 0.100284 0.081864 0.177032l-0.124843-0.008186L475.29196 442.777429zM474.862171 442.664865c0.039909 0.046049 0.063445 0.113587 0.045025 0.186242l-0.12689-0.032746L474.862171 442.664865zM474.432383 442.418248 474.432383 442.418248l-0.010233 0.014326L474.432383 442.418248zM474.123344 442.110233C474.123344 442.110233 474.123344 442.110233 474.123344 442.110233l-0.013303 0.011256L474.123344 442.110233zM473.740628 440.517969l0-0.109494 0.132006 0.061398C473.839889 440.498526 473.794863 440.517969 473.740628 440.517969z"
          p-id="1800"
        />
        <path
          d="M364.968295 432.942433c26.808576 0 48.579415-21.715581 48.579415-48.502667 0-26.829042-21.731954-48.541553-48.579415-48.541553-26.850531 0-48.582485 21.713534-48.582485 48.541553C316.390927 411.226852 338.122881 432.942433 364.968295 432.942433L364.968295 432.942433 364.968295 432.942433zM656.437623 432.942433c26.817786 0 48.597835-21.715581 48.597835-48.502667 0-26.829042-21.780049-48.541553-48.597835-48.541553-26.820855 0-48.571229 21.713534-48.571229 48.541553C607.866395 411.226852 629.616768 432.942433 656.437623 432.942433L656.437623 432.942433 656.437623 432.942433zM510.686075 64.023152c-246.808152 0-446.902376 199.936635-446.902376 446.582081 0 246.62191 200.094224 446.598454 446.902376 446.598454 246.823502 0 446.902376-199.977567 446.902376-446.598454C957.618127 263.958764 757.539252 64.023152 510.686075 64.023152L510.686075 64.023152 510.686075 64.023152zM510.686075 915.313625c-223.677339 0-404.988778-181.189665-404.988778-404.670529 0-223.538169 181.316555-404.744207 404.988778-404.744207 223.677339 0 404.993894 181.187619 404.993894 404.705322 0 223.51975-179.63424 404.729881-404.993894 404.729881L510.686075 915.313625 510.686075 915.313625zM724.469066 510.644119c-10.752902 0-19.434631 8.664334-19.434631 19.412119 0 107.238396-86.993307 194.21226-194.313567 194.21226-107.285468 0-194.330964-86.97284-194.330964-194.21226 0-10.747785-8.698103-19.412119-19.423375-19.412119-10.730389 0-19.430538 8.664334-19.430538 19.412119 0 128.652102 104.403838 232.984309 233.180783 232.984309 128.772852 0 233.147014-104.332207 233.147014-232.984309C743.835136 519.308453 735.164662 510.644119 724.469066 510.644119L724.469066 510.644119 724.469066 510.644119zM724.469066 510.644119"
          p-id="1801"
        />
      </svg>
      <svg
        v-else
        @click="toggle"
        t="1596889151556"
        class="icon aaa"
        viewBox="0 0 1024 1024"
        version="1.1"
        xmlns="http://www.w3.org/2000/svg"
        p-id="4104"
      >
        <path
          d="M668.83437 715.958057a16.829889 16.829889 0 0 1-16.829889-16.829889c0-51.611659-62.831585-93.686381-140.024675-93.686381s-140.136874 42.074722-140.136874 93.686381a16.829889 16.829889 0 0 1-33.659778 0c0-70.236736 77.978485-127.23396 173.796652-127.23396S685.552059 628.891432 685.552059 699.128168a16.829889 16.829889 0 0 1-16.829888 16.829889z"
          p-id="4105"
        />
        <path
          d="M511.979806 1023.945022a511.965218 511.965218 0 1 1 511.965218-511.853019 512.526215 512.526215 0 0 1-511.965218 511.853019z m0-967.718607a455.865589 455.865589 0 1 0 455.865589 455.865588A456.314386 456.314386 0 0 0 511.867607 56.226415z"
          p-id="4106"
        />
        <path
          d="M726.614812 406.517721m-8.475658 50.228381a50.938464 50.938464 0 1 0 16.951316-100.456762 50.938464 50.938464 0 1 0-16.951316 100.456762Z"
          p-id="4107"
        />
        <path
          d="M296.330654 406.517721m-8.475658 50.228381a50.938464 50.938464 0 1 0 16.951316-100.456762 50.938464 50.938464 0 1 0-16.951316 100.456762Z"
          p-id="4108"
        />
      </svg>
      <div>
        <el-dropdown v-if="this.avatar" trigger="click" style="cursor:pointer">
          <span class="el-dropdown-link">
            <img class="avatar" :src="this.avatar" alt />
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item icon="el-icon-setting" @click.native="userset">
              <span >个人设置</span>
            </el-dropdown-item>
            <el-dropdown-item icon="el-icon-edit" @click.native="editcenterClick">创作中心</el-dropdown-item>
            <el-dropdown-item icon="el-icon-folder-opened" @click.native="starClick">我的收藏</el-dropdown-item>
            <el-dropdown-item icon="el-icon-switch-button" @click.native="loginOut">注销</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
        <svg
          v-else
          @click="userClick"
          t="1595861446822"
          class="icon"
          viewBox="0 0 1024 1024"
          version="1.1"
          xmlns="http://www.w3.org/2000/svg"
          p-id="4744"
        >
          <path
            d="M505.258459 542.261211c149.730163 0 271.149537-120.136148 271.149537-268.350794 0-148.135852-121.419374-268.308839-271.149537-268.308839-149.815097 0-271.234471 120.172987-271.234471 268.308839C234.022964 422.125063 355.442338 542.261211 505.258459 542.261211L505.258459 542.261211zM512 567.638181c-209.645764 0-474.556203 168.199817-474.556203 375.667985l0 67.802222 949.112406 0 0-67.802222C986.556203 735.843114 721.639624 567.638181 512 567.638181L512 567.638181zM512 567.638181"
            p-id="4745"
          />
        </svg>
      </div>
    </div>
    <el-dialog
      title="个人设置"
      :visible.sync="dialogFormVisible"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :width="mobile?'90%':'50%'"
      :before-close="commentClose"
    >
      <el-form :model="form" style="height:300px">
        <el-form-item label="用户名" label-width="70px">
          <el-input v-model="form.userName" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="头像上传">
          <el-upload
            class="avatar-uploader"
            action='http://81.70.59.91:3000/server/api/upload'
            :show-file-list="false"
            :on-success="handleAvatarSuccess"
            :before-upload="beforeAvatarUpload"
          >
            <img v-if="imageUrl" :src="imageUrl" class="useravatar" />
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>
        </el-form-item>
        <el-form-item style="float:right;">
          <el-button type="primary" @click="avatarConfirm" v-preventClick>确认</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "NavBar",
  props: {
    subtitle: {
      type: String,
      // default:'123'
    },
  },
  created(){
    this.getUser()
    if(window.innerWidth<=700){
      this.mobile = true
    }else{
      this.mobile = false
    }
  },
  data() {
    return {
      mobile:false,
      dialogFormVisible: false,
      imageUrl:'',
      form: {
        userName: "",
        avatar: "",
      },
      happy: true,
      searchText: "",
      avatar: localStorage.userAvatar,
    };
  },
  methods: {
    async remove(){
      const {data} = await this.$http.delete('/upload')
      if(data.result=='ok'){
        this.$message.success(`清理完成,清理了${data.count}个文件`)
      }
    },
    loginOut(){
      this.$confirm("确定清除登录信息并退出?", "确认操作", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          localStorage.clear()
          this.$router.push('/login')
        })
        .catch(() => {});
    },
    editcenterClick(){
      if(this.mobile){
           window.scrollTo({
        top: 20,
        behavior: "smooth",
      });
      }
      this.$router.push('editcenter')
    },
    starClick(){
      if(this.mobile){
           window.scrollTo({
        top: 20,
        behavior: "smooth",
      });
      }
      this.$router.push('star')
    },
    async getUser(){
      if(localStorage.token){
        const {data} = await this.$http.get('/userset')
      
      this.imageUrl = data.avatar
      this.form.avatar = data.avatar
      this.form.userName = data.userName
      localStorage.userAvatar = data.avatar
      this.avatar = data.avatar
      }
      else{
        return
      }
    },
    async avatarConfirm(){
      const {data} = await this.$http.put('/user',this.form)
      this.avatar = data
      localStorage.userAvatar = data;
      this.dialogFormVisible = false
      this.$message.success('修改成功')
    },
    search($event) {
      alert("搜索功能暂未开放");
      // console.log($event.target.value)
    },
    notice() {
      alert("通知");
      // console.log(this.$route);
    },
    toggle() {
      this.happy = !this.happy;
    },
    userClick() {
      this.$router.push("/login");
    },
    logoClick() {
       if(this.mobile){
         window.scrollTo({
        top: 0,
        behavior: "smooth",
      });
      }
      this.$router.push("/");
     
    },
    async userset() {
      this.getUser()
      this.dialogFormVisible = true;
      
    },
    handleAvatarSuccess(res){
      this.imageUrl = res.url
      this.form.avatar = res.url
    },
    beforeAvatarUpload(file) {
        const isJPG = file.type === 'image/jpeg' || file.type === 'image/png';
        const isLt2M = file.size / 1024 / 1024 <= 1;

        if (!isJPG) {
          this.$message.error('上传图片只能是 JPG或者PNG 格式!');
        }
        if (!isLt2M) {
          this.$message.error('上传图片大小不能超过 1MB!');
        }
        return isJPG && isLt2M;
      },
    commentClose(){
     
      this.imageUrl = ""
      this.form.avatar = ""
       this.dialogFormVisible =false
    }
  },
};
</script>


<style lang="scss" scoped >

.useravatar{
  max-width: 178px;
  max-height: 178px;
}
.avatar-uploader  {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    width: 178px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
.subtitle {
  width: 80px;
  font-size: 22px;
  font-family: "楷体";
  background: rgb(255, 255, 79);
  text-align: center;
  border-radius: 10px;
}
.navbar {
  width: 1000px;
  height: 56px;
  user-select: none;
  position: relative;
  top: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  color: #8a8a8a;
}
.container {
  border-radius: 5px;
  min-width: 1032px;
  top: 0;
  position: fixed;
  height: 56px;
  width: 100%;
  background-color: white;
  z-index: 99;
}
#a {
  background: url('~@/assets/img/艺术字.png');
  height: 100%;
  background-size: cover;
  cursor: pointer;
  width: 250px;
  color: rgb(241, 23, 223);
}
#search {
  color: rgb(0, 195, 255);
   line-height: 40px;
  width: 250px;
  overflow: hidden;
  height: 40px;
  font-size: 16px;
  white-space: nowrap;
  text-overflow: ellipsis;
  span{
    font-style: italic;
  }
  span:hover{
    text-decoration: underline;
  }
  // background: #eee;
}
.icon {
 
  width: 24px;
  height: 24px;
  fill: currentcolor;
  cursor: pointer;
}
.avatar {
  width: 40px;
  height: 40px;
}
@media screen and(max-width: 700px){
  .container{
    width: 100%;
    min-width: 0px;
  }
  .navbar{
    
    width: 100%;
  }
  #search,.subtitle,.aaa{
    display: none;
  }
  .navbar{
    justify-content: space-around;
  }
}
</style>
